<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>学校毕业审核</title>
  <link href="http://libs.baidu.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet">
  <link href="../../css/style.css" rel="stylesheet">
  <style>
    .form-horizontal .form-group {
      display: flex;
      justify-content: space-evenly;
      margin: 15px 0;
    }
  </style>
</head>

<body>
  <div class="shadow-box"></div>
  <div class="container">
    <form class="form-horizontal form-inline">
      <div class="form-group col-xs-12">
        <input class="form-control col-xs-3" type="file">
        <button type="submit" class="btn btn-default col-xs-1">导入</button>
        <input class="form-control col-xs-1" type="text" placeholder="毕业年度">
        <select class="form-control col-xs-1" name="" id="" placeholder="-专业名称-">
          <option value="" selected>-专业名称-</option>
          <option value="">计算机应用</option>
          <option value="">汽车运用与维修</option>
          <option value="">机电设备安装与维修</option>
          <option value="">有色金属冶炼</option>
          <option value="">中餐烹饪饭店运营与管理</option>
          <option value="">高星级饭店运营与管理</option>
          <option value="">民族音乐与舞蹈</option>
          <option value="">美发与形象设计</option>
        </select>
        <button type="submit" class="btn btn-default col-xs-1">查询</button>
      </div>
    </form>
    <div class="row">
      <table class="table table-bordered table-hover">
        <tr>
          <th>序号</th>
          <th>毕业年度</th>
          <th>毕业人数</th>
          <th>专业个数</th>
          <th>经办人</th>
          <th>联系电话</th>
          <th>创建时间</th>
          <th>更新时间</th>
          <th>审核状态</th>
          <th>操作</th>
        </tr>
        <tr>
          <td>1</td>
          <td>2020</td>
          <td>213</td>
          <td>7</td>
          <td>王继东</td>
          <td>18907761655</td>
          <td>2020-06-12</td>
          <td>2020-06-12</td>
          <td>未提交</td>
          <td>
            <button class="btn-link">修改</button> |
            <button class="btn-link">删除</button>
          </td>
        </tr>
      </table>
    </div>
  </div>
  <script>
    let tbody = document.querySelector('table tbody');
    for (let i = 0; i < 8; i++) {
      let tr = document.querySelectorAll('table tr')[1].cloneNode(true);
      tbody.appendChild(tr)
    }
  </script>
</body>

</html>